<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title> MAGNETO Admin Skin</title>
	[#include "/commons/defaultHead.ftl"/]
	[#-- Multi Select --]
	<link rel="stylesheet" type="text/css" href="${staticsDir}/multiselect/jquery.multiselect.css"/>
	<script type="text/javascript" src="${staticsDir}/multiselect/jquery.multiselect.js"></script>
	
	<script type="text/javascript" src="${jsDir}/system/admin/usermanager.js"></script>
	
	<style>
		#username, #password {
		    background: none repeat scroll 0 0 transparent;
		    border: 1px solid #C0C0C0;
		    border-radius: 5px 5px 5px 5px;
		    color: black;
		    font-size: 12px;
		    height: 20px;
		    margin: 0 0 12px;
		    padding: 2px 0 2px 5px;
		    width: 82%
		}
	</style>
</head>

<body>
	
<div id="content">
<div class="column full">
		<div class="box width100 fl"> 
		<h2 class="box-header">用户管理</h2>
		<div class="box-content">
			<div class="search-box">
				用户：<input id="nicknameText" class="form-field small" style="width: 120px" type="text" value=""> &nbsp;&nbsp;
				部门：
				<select id="deptSearchSel" class="" style="width: 150px" title="选择部门">
					<option name="" value="0"></option>
					[#list deptLst as dept]
					<option name="${dept.name}" value="${dept.id}">${dept.name}</option>
					[/#list]
				</select>
				<div class="search-box-button">
					<a id="searchA" class="button themed"><span class="icon_text pack_white _10"></span>搜索</a>
					<a id="resetA" class="button red"><span class="icon_text pack_white _5"></span>清空</a>
				</div> 
			</div>
			
			<div class="toolbar">
			<a id="addUserA" class="button white" href="javascript:void(0)"><span class="icon_text addnew"></span>新增用户</a>
			<a id="updateUserA" class="button white" href="javascript:void(0)"><span class="icon_text edit"></span>修改用户</a>
			<a id="delUserA" class="button white" href="#"><span class="icon_text cancel"></span>删除用户</a>
			</div>
			
		<table id="msgDatagird" style="display: none"></table>
		</div>
		</div>
		
		<div class="box-content">
		<div id="userDialog" class="dialog" title="新增用户">
				<form id="userForm">
					<table id="userTable" class="width100">
					<tr>
					<td class="width10"><label class="form-label"> 用户： </label></td>
					<td class="width40"><input id="username" class="form-field" name="username" type="text" value="" maxlength="16"/></td>
					<td class="width10"><label class="form-label"> 姓名： </label></td>
					<td class="width40"><input id="nickname" class="form-field" name="nickname" type="text" value="" maxlength="12"/></td>
					</tr>
					<tr>
					<td><label class="form-label"> 密码： </label></td>
					<td><input id="password" class="form-field" name="password" type="password" value="" maxlength="16"/></td>
					<td><label class="form-label"> 确认： </label></td>
				 	<td><input id="passwordConfirm" class="form-field" name="passwordConfirm" type="password" value="" maxlength="16"/></td>
					</tr>
					<tr>
					<td><label class="form-label"> 部门: </label></td>
					<td>
						<select id="deptSel" class="" style="width:86%" title="选择部门">
							[#list deptLst as dept]
							<option name="${dept.name}" value="${dept.id}">${dept.name}</option>
							[/#list]
						</select>
					</td>
					<td><label class="form-label"> 角色: </label></td>
					<td>
						<select id="roleSel" class="" style="width:100px" title="选择角色" multiple="multiple">
							[#list roleLst as role]
							<option name="${role.name}" value="${role.id}">${role.name}</option>
							[/#list]
						</select>
					</td>
					</tr>
					<tr>
					<td colspan="4">&nbsp;<td>
					</tr>
					<tr>
					<td><label class="form-label"> 电话： </label></td>
					<td><input id="phone" class="form-field" name="phone" type="text" value="" maxlength="15"/></td>
					<td><label class="form-label"> 邮箱： </label></td>
					<td><input id="email" class="form-field" name="email" type="text" value="" maxlength="16"/></td>
					</tr>
					<tr>
					<td class="width10" valign="top"><label class="form-label"> 备注： </label></td>
					<td colspan="3" class="">
						<textarea id="description" class="form-field" style="width:92%;height: 150px;" name="description" cols="" rows=""></textarea>
					</td>
					</tr>
					</table>
					<div class="fr">
						<input id="resetBtn" class="button red" type="button" value="重置" name="resetBtn" />
						<input id="submitBtn" class="button themed" type="button" value="确认提交" name="submitBtn" />
					</div>
				</form>
				
				</div>
				
				<div id="dialog-confirm" title="删除用户">
					<p id="delUserDialogP">
					<span  class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0; font-size:14px">
					</span>
					该操作将删除选定的用户信息，确定这样做?!
					</p>
				</div>
		</div>
		
		<div class="clear"></div>
</div> 
</div> 
</body>
</html>